このモジュールでは、`CanvasRenderingContext2D` の状態を操作することで、静的パスから動的でイベント駆動型のツールへと移行します。 CanvasRenderingContext2D アプリケーションの機能拡張に注力し、 高階パターン 数学的なフィルタリングを通じて実現します。

1. 高階ツールパターン

たとえば tools.Line は、 trackDragというヘルパーを使ってマウスイベントを抽象化します。逆に、 tools.Spray は インターバルベースの繰り返し によって実装し、 setIntervalマウスボタンを押したままの間、連続してピクセルを配置できるようにします。

2. 数学的制約

単純なランダムオフセットは正方形分布を作ります。自然な円形の「ブラシ」効果を得るには、ピタゴラスの定理で点をフィルタリングします：$x^2 + y^2 < r^2$。あるいは、極座標を使用し、 Math.sin と Math.cos を使って変換することもできます。

3. 合成操作と状態

標準的なストロークを超えて、 globalCompositeOperation プロパティは、新しいピクセルが既存のピクセルとどのように相互作用するかを定義します。たとえば、 'destination-out' に設定すると、 tools.Erase 関数がピクセルを白く塗りつぶすのではなく、透過させるようになります。UIコントロールとして、 controls.color と controls.brushSize は、 fillStyle と lineWidth それぞれをリアルタイムで更新します。